<template>
    <n-form label-placement="left" :model="form" :rules="rules">
        <n-grid cols="1" x-gap="24">
            <n-gi>
                <!--		头像	二维码		-->
                <div class="flex items-center mb-5">
                    <div class="flex items-center flex-col">
                        <span class="block mb-16px" style="font-size: 24px">头像LOGO</span>
                        <jb-avatar v-model:src="form.logo" width="100"></jb-avatar>
                    </div>
                    <div class="flex items-center flex-col ml-50">
                        <span class="block mb-16px" style="font-size: 24px">二维码</span>
                        <jb-avatar v-model:src="form.qrcode" width="100"  :fallbackSrc="fallbackImgSrc"></jb-avatar>
                    </div>
                </div>
            </n-gi>
            <n-gi>
                <n-form-item :span="12" label="名称：" path="name">
                    <span>{{form.name}}</span>
                </n-form-item>
                <n-form-item :span="12" label="简介：">
                    <span>{{form.briefInfo}}</span>
                </n-form-item>
                <n-form-item :span="12" label="备注：">
                    <span>{{form.remark}}</span>
                </n-form-item>
                <n-form-item :span="12" label="平台类型：" path="type">
                    <span>{{form.typeName}}</span>
                </n-form-item>
                <n-form-item :span="14" label="主体类型：" path="subjectType">
                    <span>{{form.subjectTypeName}}</span>
                </n-form-item>
                <n-form-item :span="12" label="是否认证：" path="isAuthenticated">
                    <span>{{form.isAuthenticatedName ? '是' : '否'}}</span>
                </n-form-item>
            </n-gi>

        </n-grid>
    </n-form>
</template>

<script setup lang="ts">

import {onMounted, ref} from "vue";
import {JBoltApi} from "@/utils";
import fallbackImgSrc from '@/assets/imgs/_builtin/default_qrcode.png?url'

const props = defineProps<{
    id: string
}>()





const form = ref({})

onMounted(() => {
    if (props.id) {
        JBoltApi.get(`/api/admin/app/linkTarget/${props.id}`).then(res => {
            form.value = res.result.data
        })
    }
})

</script>


<style scoped>

</style>